<div class="leftbody" ng-controller="articleCtrl">
    <section class="col-md-8 col-sm-12 col-xs-12 articleContent">
        <div class="articleTitle" ng-cloak>
            <!--文章标题和内容部分-->
            <h2>{{ articles.title }}</h2>
            <ul>
                <li>发布于{{ articles.date }}</li>
                <li>作者 {{ articles.author }}</li>
                <li>{{ articles.pv }}次浏览</li>
                <li>来自 {{ articles.selectName }}</li>
                <div class="clear"></div>
                <%if(userInfo){%>
                <div id="settingBar" ng-show="(articles.author == userName)">
                    <a href="/users/updateArticle?_id=<%= articleId %>" title="修改"><span class="glyphicon glyphicon-edit"></span></a>
                    <a href="#" title="删除" ng-click="deleteFun()" ><span class="glyphicon glyphicon-trash"></span></a>
                </div>
                <%}%>
            </ul>
            <section class="arContent" ng-bind-html="articles.content | to_trusted"></section>
        </div>
        <div class="articleComments" id="com" ng-show="articles.comments.length" ng-cloak>
            <!--显示留言部分-->
            <h3>{{ articles.comments.length }}回复</h3>
            <div ng-repeat="comment in articles.comments">
                <a href="/users/otherUser?author={{ comment.users.userName }}"><img ng-src="{{ comment.users.logo }}" width="30px" height="30px"> {{ comment.users.userName }}</a>
                <a href="#">{{ comment.no }}楼·{{ comment.date }}</a>
                <a class="zan" href="javascript:void(0);" ng-show="userName" ng-click="doZan(  comment.no-1 )"><i class="glyphicon glyphicon-thumbs-up"></i> {{ comment.zanNum }}</a>
                <div class="clear"></div>
                <section style="margin-left: 30px;" ng-bind-html="comment.content | to_trusted"></section>
            </div>
        </div>
        <% if ( logined ) {%>
        <div ng-cloak>
            <!--提交留言的表单-->
            <form class="form-horizontal" name="addCommentsForm" ng-submit="addComments(addCommentsForm.$valid)" novalidate>
                <h3>添加回复 &nbsp;<small class="text-danger hide" id="errorInfo">提交内容出现错误</small></h3>
                <div class="form-group">
                    <div class="col-sm-10 col-sm-offset-1">
                        <textarea class="form-control" name="comments" id="comments" rows="5" ng-minlength="10" ng-model="formData.comments" required></textarea>
                        <label ng-cloak for="inputError" class="control-label text-danger" ng-show="addCommentsForm.comments.$invalid && !addCommentsForm.comments.$pristine"><i class="glyphicon glyphicon-exclamation-sign"></i>留言的长度必须在10-500字符之间</label>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-offset-1 col-sm-10 ">
                        <button class="btn btn-info">提交</button>
                    </div>
                </div>
            </form>
        </div>
        <% } %>
    </section>

    <section>
        <%- include rightArticle %>
    </section>
    <div class="back-to-top"><i class="glyphicon glyphicon-chevron-up"></i></div>
</div>
<script>
    var webApp = angular.module('webApp',[]);
    //让angular可以解析html代码的过滤器
    webApp.filter('to_trusted', ['$sce', function ($sce) {
        return function (text) {
            return $sce.trustAsHtml(text);
        };
    }]);
    webApp.controller('articleCtrl',function ($scope,$http) {
        $scope.userName = '<%= userName %>';
        //$scope.formData = {};
        //打开文章详情页面
        $http({
            method:'GET',
            url:'/users/articleInfo?_id=' + '<%= articleId %>',
        }).success(function (data) {
            if(data === 'error') {
                alert('没有找到当前文章');
                window.location = '/';
            } else {
                if(data.selectName === 'share'){
                    data.selectName = '分享'
                } else if(data.selectName === 'ask'){
                    data.selectName = '问答'
                }
                $scope.articles = data;
                if ($scope.userName ) {
                    //点赞的显示
                    $scope.isZan = new Array();
                    $scope.articles.comments.forEach(function (comm) {
                        comm.zanUser.forEach(function (user) {
                            if (user == $scope.userName) {
                                $scope.isZan[comm.no-1] = '1';
                                //$('.zan').addClass('isZan');
                                return;
                            } else {
                                $scope.isZan[comm.no-1] = '0';
                                //$('.zan').eq(comm.no-1).removeClass('isZan');
                            }

                        })
                    });
                    /*$scope.index = 0;
                    $scope.isZan.forEach(function (showw) {
                        if (showw == '1') {
                            console.log($scope.index);
                            console.log(showw);
                            $('.zan').eq($scope.index++).addClass('isZan');
                            alert('1'+ $scope.index);
                        } else {
                            $('.zan').eq($scope.index++).removeClass('isZan');
                            alert('0'+ $scope.index);
                        }
                    })*/
                    $scope.doZan = function ( no ) {
                        $http.get('/users/zan?_id='+'<%= articleId %>'+'&zanUser='+ $scope.userName +'&no='+ no +'&isZan='+$scope.isZan[no])
                                .success(function (ddd) {
                                    if ( ddd === 'error' ) {
                                        alert('点赞失败');
                                    } else {
                                        if(ddd.selectName === 'share'){
                                            ddd.selectName = '分享'
                                        } else if(ddd.selectName === 'ask'){
                                            ddd.selectName = '问答'
                                        }
                                        $scope.articles = ddd;
                                        $scope.articles.comments[no].zanUser.forEach(function (user) {
                                            if (user == $scope.userName) {
                                                $scope.isZan[no] = '1';
                                                return;
                                            } else {
                                                $scope.isZan[no] = '0';
                                            }
                                            return;
                                        });
                                        /*$scope.index = 0;
                                        $scope.isZan.forEach(function (showw) {
                                            if (showw == '1') {
                                                console.log($scope.index);
                                                console.log(showw);
                                                $('.zan').eq($scope.index++).addClass('isZan');
                                                alert('1'+ $scope.index);
                                            } else {
                                                $('.zan').eq($scope.index++).removeClass('isZan');
                                                alert('0'+ $scope.index);
                                            }
                                        })*/

                                    }

                                })
                    }
                }
            }
        });
        $http({
            method:'GET',
            url:'/users/authorInfo?_id=' + '<%= articleId %>',
        }).success(function (data) {
            if(data === 'error') {
                alert('没有找到该用户');
                window.location = '/';
            } else {
                //console.log(data);
                $scope.userData = data;
                $http({
                    method:'GET',
                    url:'/users/otherArticleInfo?author=' + data.userName,
                }).success(function (result) {
                    if(result === 'error') {
                        alert('没有找到该用户');
                        window.location = '/';
                    } else {
                        var artic = [];
                        if(result.length < 5){
                            $scope.arData = result;
                        } else {
                            for( var i=0;i<5;i++){
                                artic.push(result[i])
                            }
                            $scope.arData = artic;
                        }
                    }
                });
            }
        });
        //删除行为
        $scope.deleteFun = function () {
            var c = confirm('是否要删除话题？(删除后不能恢复！)');
            if ( c ) {
                $http.get('/users/deleteArticle?_id=<%= articleId %>')
                        .success(function (data) {
                            if( data == 'success'){
                                alert('删除话题成功！点击跳转到首页');
                                window.location = '/';
                            } else {
                                alert(data);
                            }
                        })
            }
        }

        $scope.addComments = function (isVaild) {
            if ( isVaild ) {
                //如果表单内容格式正确
                $scope.formData._id = '<%= articleId %>';
                //console.log($.param($scope.formData));
                $http({
                    method: 'POST',
                    url: '/users/addComments',
                    data: $.param($scope.formData),
                    headers: {'Content-Type': 'application/x-www-form-urlencoded'}
                }).success(function (data) {
                    if (data === 'success') {
                        alert('留言发表成功');
                        $http({
                            method:'GET',
                            url:'/users/articleInfo?_id=' + '<%= articleId %>',
                        }).success(function (data) {
                            if(data === 'error') {
                                alert('没有找到当前文章');
                                window.location = '/';
                            } else {
                                $scope.articles = data;
                                $scope.articles.comments.forEach(function (comm) {
                                    comm.zanUser.forEach(function (user) {
                                        if (user == $scope.userName) {
                                            $scope.isZan[comm.no-1] = '1';
                                            return;
                                        } else {
                                            $scope.isZan[comm.no-1] = '0';
                                        }
                                    })
                                });
                            }
                        });
                    } else {
                        $('#errorInfo').removeClass('hide').text(data);
                    }
                })
            } else {
                alert('输入有误！');
            }
        };
    });


    $(function () {
        var $backToTop = $(".back-to-top");
        /* 隐藏回顶部按钮 */
        $backToTop.hide();
        $(window).on('scroll', function() {
            if ($(this).scrollTop() > 100) { /* 返回顶部按钮将在用户向下滚动100像素后出现 */
                $backToTop.fadeIn(500);
            } else {
                $backToTop.fadeOut(500);
            }
        });
        $backToTop.on('click', function(e) {
            $("html, body").animate({scrollTop: 0}, 300);
        });

    });
</script>